<!DOCTYPE html>
<html>
<head>

    <title i18n="filtering_log_title"></title>

    <meta charset="utf-8">
    <link type="text/css" rel="stylesheet" href="css/main.css">
    <link type="text/css" rel="stylesheet" href="../lib/content-script/css/alert-popup.css">

    <script type="text/javascript" src="../lib/libs/moment-with-locales.js"></script>
    <script type="text/javascript" src="../lib/content-script/adguard-content.js"></script>
    <script type="text/javascript" src="../lib/content-script/common-script.js"></script>
    <script type="text/javascript" src="../lib/content-script/content-script.js"></script>
    <script type="text/javascript" src="../lib/content-script/content-utils.js"></script>
    <script type="text/javascript" src="../lib/content-script/i18n-helper.js"></script>
    <script type="text/javascript" src="../lib/pages/i18n.js"></script>
    <script type="text/javascript" src="../lib/pages/script.js"></script>
    <script type="text/javascript" src="../lib/pages/log.js"></script>
</head>
<body>
    <div class="log-journal">
        <div class="log-header">
        <div class="col-tabs">
            <div class="col-logo"><img id="logoIcon" src="images/shield.svg" alt=""></div>
            <div class="col-tab" i18n="filtering_log_tab"></div>
            <div class="col-tab-drop">
                <select id="tabSelector" class="tab-selector-dropdown" data-toggle="dropdown" data-target="#tabSelector"></select>
            </div>
        </div>
        <div class="col-refresh">
            <a class="btn reloadTab" i18n="filtering_refresh_tab"></a>
            <a id="clearTabLog" href="#" class="text-green" i18n="filtering_clear_tab_events"></a>
            <div id="preserveLog" class="checkb-wrap">
                <div class="checkbox"></div>
                <label i18n="filtering_log_preserve_log"></label>
            </div>
        </div>
        <div class="col-search">
            <div class="icon-search"><img src="images/magnifier.svg" alt=""></div>
            <input type="text" i18n-plhr="filtering_log_search_string" name="searchEventRequest"/>
        </div>
        <div class="col-filter-log">
            <div class="col-type-tabs">
                <a class="searchEventType active" href="#" i18n="filtering_type_all"></a>
                <a class="searchEventType" href="#" attr-type="DOCUMENT,SUBDOCUMENT">HTML</a>
                <a class="searchEventType" href="#" attr-type="STYLESHEET">CSS</a>
                <a class="searchEventType" href="#" attr-type="SCRIPT">JavaScript</a>
                <a class="searchEventType" href="#" attr-type="XMLHTTPREQUEST">Ajax</a>
                <a class="searchEventType" href="#" attr-type="IMAGE">Image</a>
                <a class="searchEventType" href="#" attr-type="OBJECT,MEDIA">Media</a>
                <a class="searchEventType" href="#" attr-type="OTHER,FONT,WEBSOCKET,CSP,COOKIE">Other</a>
            </div>
            <div class="col-rules col-rules--filter-check">
                <div class="checkb-wrap searchEventThirdParty">
                    <div class="checkbox"></div>
                    <label>Third party</label>
                </div>
                <div class="checkb-wrap searchEventBlocked">
                    <div class="checkbox"></div>
                    <label>Blocked</label>
                </div>
                <div class="checkb-wrap searchEventWhitelisted">
                    <div class="checkbox"></div>
                    <label>Whitelisted</label>
                </div>
            </div>
        </div>
    </div>

        <table class="log-table">
            <thead>
                <th>URL</th>
                <th i18n="filtering_table_type"></th>
                <th i18n="filtering_table_rule"></th>
                <th i18n="filtering_table_filter"></th>
                <th i18n="filtering_table_source"></th>
            </thead>
            <tbody id="logTable" class="hidden"></tbody>
        </table>

        <div id="logTableEmpty" class="log-empty hidden">
            <img src="images/log-empty.png" alt="">
            <div class="desc">
                <span i18n="filtering_table_empty_row"></span>
                <span i18n="filtering_table_empty_reload_page"></span>
            </div>
        </div>

        <div id="modal-request-info" class="modal modal-request-details" style="display: none;">
        <div class="head">
            <div class="close" data-dismiss="modal" aria-label="Close"></div>
            <div class="title" i18n="filtering_modal_info_title"></div>
        </div>
        <div class="body">
            <ul class="list">
                <li>
                    <div class="name">URL:</div>
                    <div class="value" attr-text="requestUrl"></div>
                </li>
                <li>
                    <div class="name" i18n="filtering_modal_element"></div>
                    <div class="value" attr-text="element"></div>
                </li>
                <li>
                    <div class="name">Cookie:</div>
                    <div class="value" attr-text="cookie"></div>
                </li>
            </ul>
            <ul class="list">
                <li>
                    <div class="name" i18n="filtering_modal_type"></div>
                    <div class="value" attr-text="requestType"></div>
                </li>
                <li>
                    <div class="name" i18n="filtering_modal_source"></div>
                    <div class="value" attr-text="frameDomain"></div>
                </li>
                <li>
                    <div class="name" i18n="filtering_modal_rule"></div>
                    <div class="value" attr-text="requestRule"></div>
                </li>
                <li>
                    <div class="name" i18n="filtering_modal_rules"></div>
                    <div class="value" attr-text="replaceRules" id="replaceRules"></div>
                </li>
                <li>
                    <div class="name" i18n="filtering_modal_privacy"></div>
                    <div class="value" attr-text="stealthActions" id="stealthActions"></div>
                </li>
                <li>
                    <div class="name" i18n="filtering_modal_filter"></div>
                    <div class="value" attr-text="requestRuleFilter"></div>
                </li>
            </ul>
            <ul class="list">
                <li>
                    <div class="adg-modal-window-locking-info-right pull-right" style="display: none;">
                        <img class="adg-modal-window-locking-info-right-pic" attr-src="requestUrl">
                    </div>
                </li>
            </ul>
        </div>
        <div class="foot">
            <a id="openRequestNewTab" href="#" class="btn" i18n="filtering_modal_open_in_new_tab"></a>
            <a id="blockRequest" href="#" class="btn hidden" i18n="filtering_modal_block"></a>
            <a id="unblockRequest" href="#" class="btn hidden" i18n="filtering_modal_unblock"></a>
            <a id="removeUserFilterRule" href="#" class="btn hidden" i18n="filtering_modal_remove_user"></a>
            <a id="removeWhiteListDomain" href="#" class="btn hidden" i18n="filtering_modal_remove_whitelist"></a>
        </div>
    </div>

    <div id="modal-create-block-rule"  class="modal modal-add-new-rule" style="display: none;">
        <div class="head">
            <div class="close" data-dismiss="modal" aria-label="Close"></div>
            <div class="title" i18n="filtering_modal_add_title"></div>
        </div>
        <div class="body">
            <ul class="list">
                <li>
                    <div class="name" i18n="filtering_modal_rule_text"></div>
                    <div class="value"><input type="text" class="rule-text" name="ruleText"/></div>
                </li>
            </ul>
            <ul class="list filtering-modal-patterns">
                <li>
                    <div class="name" i18n="filtering_modal_patterns"></div>
                    <div class="value">
                        <ul id="rulePatterns" class="list"></ul>
                    </div>
                </li>
            </ul>
            <ul class="list filtering-modal-options">
                <li>
                    <div class="name" i18n="filtering_modal_options"></div>
                    <div class="value">
                        <ul class="list">
                            <li class="checkb-wrap">
                                <input name="ruleDomain" class="checkbox-input" type="checkbox"/>
                                <label><div class="checkbox"></div><span i18n="filtering_modal_apply_domains"></span></label>
                            </li>
                            <li class="checkb-wrap">
                                <input name="ruleMatchCase" class="checkbox-input" type="checkbox"/>
                                <label><div class="checkbox"></div><span i18n="filtering_modal_match_case"></span></label>
                            </li>
                            <li class="checkb-wrap">
                                <input name="ruleThirdParty" class="checkbox-input" type="checkbox"/>
                                <label><div class="checkbox"></div><span i18n="filtering_modal_third_party"></span></label>
                            </li>
                            <li class="checkb-wrap">
                                <input name="ruleImportant" class="checkbox-input" type="checkbox"/>
                                <label><div class="checkbox"></div><span i18n="filtering_modal_important"></span></label>
                            </li>
                        </ul>
                    </div>
                </li>
            </ul>
        </div>
        <div class="foot"><a id="createRule" href="#" class="btn" i18n="filtering_modal_add_rule"></a></div>
    </div>

        <div id="modal-create-exception-rule" class="modal modal-add-new-rule" style="display: none;">
        <div class="head">
            <div class="close" data-dismiss="modal" aria-label="Close"></div>
            <div class="title" i18n="filtering_modal_exception_title"></div>
        </div>
        <div class="body">
            <ul class="list">
                <li>
                    <div class="name" i18n="filtering_modal_rule_text"></div>
                    <div class="value"><input type="text" class="rule-text" name="ruleText"/></div>
                </li>
            </ul>
            <ul class="list filtering-modal-patterns">
                <li>
                    <div class="name" i18n="filtering_modal_patterns"></div>
                    <div class="task-manager-content-header-item task-manager-content-item-filter">
                        <div class="task-manager-content-header-item-wrap" i18n="filtering_table_filter"></div>
                        <div class="value">
                            <ul id="rulePatterns" class="list"></ul>
                        </div>
                    </div>
                </li>
            </ul>
            <ul class="list filtering-modal-options">
                <li>
                    <div class="name" i18n="filtering_modal_options"></div>
                    <div class="value">
                        <ul class="list">
                            <li class="checkb-wrap">
                                <input name="ruleDomain" class="checkbox-input" type="checkbox"/>
                                <label><div class="checkbox"></div><span i18n="filtering_modal_apply_domains"></span></label>
                            </li>
                            <li class="checkb-wrap">
                                <input name="ruleMatchCase" class="checkbox-input" type="checkbox"/>
                                <label><div class="checkbox"></div><span i18n="filtering_modal_match_case"></span></label>
                            </li>
                            <li class="checkb-wrap">
                                <input name="ruleThirdParty" class="checkbox-input" type="checkbox"/>
                                <label><div class="checkbox"></div><span i18n="filtering_modal_third_party"></span></label>
                            </li>
                            <li class="checkb-wrap">
                                <input name="ruleImportant" class="checkbox-input" type="checkbox"/>
                                <label><div class="checkbox"></div><span i18n="filtering_modal_important"></span></label>
                            </li>
                        </ul>
                    </div>
                </li>
            </ul>
        </div>
        <div class="foot"><a id="createRule" href="#" class="btn" i18n="filtering_modal_add_rule"></a></div>
    </div>
    </div>
</body>
</html>
